<link rel="stylesheet" href="${request.contextPath}/assets/bower_components/bootstrap-validator/dist/css/bootstrapValidator.css"/>
<script type="text/javascript" src="${request.contextPath}/assets/bower_components/bootstrap-validator/dist/js/bootstrapValidator.js"></script>
<script type="text/javascript" src="${request.contextPath}/assets/bower_components/bootstrap-validator/dist/js/language/zh_CN.js"></script>
<section class="content-header">
	<h1>&nbsp;</h1>
	<ol class="breadcrumb">
		<li><a><i class="fa fa-dashboard"></i>信息管理</a></li>
		<li class="active"><a>角色管理</a></li>
	</ol>
</section>
<!-- Main content -->
<section class="content" id="deviceContent">
	<div class="row">
		<div class="col-xs-12">
			<div class="box">
				<div class="box-body">
					<!-- 搜索条件 -->
					<table class="table">
						<tr height="45px" bgcolor="#F3F3F3">
							<td align="left"><button
								class="btn btn-danger btn-small" data-toggle="modal" onclick="showadddialog();">添加</button></td>
						</tr>
					</table>
					<!-- 结果列表 -->
					<table id="myTableData"
						class="table table-bordered table-condensed table-hover table-striped">
						<thead>
							<tr>
								<th>ID</th>
								<th>序号</th>
								<th>角色名</th>
								<th>操作</th>
							</tr>
						</thead>
						<tbody>
						</tbody>
					</table>
				</div>
			</div>
		</div>
	</div>
</section>
<#include './pop/modal.html'/>
<script>
   
   $(function(){
	 $("#myTableData").dataTable({
		 lengthMenu: [10],//这里也可以设置分页，但是不能设置具体内容，只能是一维或二维数组的方式，所以推荐下面language里面的写法。
         paging: true,//分页
         ordering: true,//是否启用排序
         searching: false,//搜索
         language: {
       	  lengthMenu: '',//左上角的分页大小显示。
             paginate: {//分页的样式内容。
                 previous: "上一页",
                 next: "下一页",
                 first: "首页",
                 last: "末页"
             },
             zeroRecords: "没有内容",//table tbody内容为空时，tbody的内容。
             //下面三者构成了总体的左下角的内容。
             info: "总共_PAGES_ 页，显示第_START_ 到第 _END_条记录 ，记录总数： _TOTAL_条 ",//左下角的信息显示，大写的词为关键字。
             infoEmpty: "0条记录",//筛选为空时左下角的显示。
             infoFiltered: ""//筛选之后的左下角筛选提示，
         },
         pagingType: "full_numbers",//分页样式的类型
         "serverSide": true,
          ajax: function (data, callback, settings) {
              //封装请求参数
              var param = {};
              param.limit = data.length;//页面显示记录条数，在页面显示每页显示多少项的时候
              param.start = data.start;//开始的记录序号
              param.page = (data.start / data.length)+1;//当前页码
              param.orderby=data.orderBys;
              //ajax请求数据
              $.ajax({
                  type: "post",
                  url: "${request.contextPath}/user/getRoleList",
                  cache: false,  //禁用缓存
                  data: param,  //传入组装的参数
                  dataType: "json",
                  success: function (result) {
                      //封装返回数据
                      var returnData = {};
                      returnData.draw = data.draw;//这里直接自行返回了draw计数器,应该由后台返回
                      returnData.recordsTotal = result.total;//返回数据全部记录
                      returnData.recordsFiltered = result.total;//后台不实现过滤功能，每次查询均视作全部结果
                      returnData.data = result.pageData;//返回的数据列表
                      //调用DataTables提供的callback方法，代表数据已封装完成并传回DataTables进行渲染
                      //此时的数据需确保正确无误，异常判断应在执行此回调前自行处理完毕
                      callback(returnData);
                  }
              });
          },
          //列表表头字段
          columns: [
              { "data": "id" },
			  { "data": null},
              { "data": "name" },
              { "data": null}
          ],
         fnDrawCallback  : function(){
             this.api().column(1).nodes().each(function(cell, i) {
                 cell.innerHTML =  i + 1;
             });
         },
          "aoColumnDefs":[
              {
                  "targets":0,
                  "visible":false
              },
              {//倒数第一列
                  "targets":-1,
                  "bSortable": false,
                  render: function(data, type, row) {
                      var html ='<button class="btn btn-success btn-small" onclick="showeditdialog(\''+data.id+'\');">编辑</button>'
                      +'&nbsp;&nbsp;&nbsp;&nbsp;<button class="btn btn-danger btn-small" onclick="delrole(\''+data.id+'\');">删除</button>';
                      return html;
                  }
              },
           ]
      });

   });
   
   function delrole(id)
   {
	   CvMsg.confirm("警告","数据删除后将无法还原！是否删除？",function(){
		   var data = {id:id}
		   $.ajax({
				url : "${request.contextPath}/user/delRole",
				type : "post",
				data : data,
				success : function(s) {
					if (s.success) {
						location.reload();
					} else {
						alert(s.msg);
					}
				}
			}); 
	   });
   }
   

 </script>